<template>
  <div>
    <el-card style="width: 100%;margin-right: 10px;margin-top: 10px">
    </el-card>
    <el-card style="width: 100%;margin-right: 10px;margin-top: 10px">
      <div>
        <el-row>
          <el-button>默认按钮</el-button>
          <el-button type="primary">主要按钮</el-button>
          <el-button type="success">成功按钮</el-button>
          <el-button type="info">信息按钮</el-button>
          <el-button type="warning">警告按钮</el-button>
          <el-button type="danger">危险按钮</el-button>
        </el-row>
      </div>
      <el-card>
        <div style="display: flex">
          <img :src="`http://localhost:8000/hotel_image_download/${hotel_id}/`" alt=""
               style="width: 500px;height: 300px">
        </div>
      </el-card>
      <el-card style="width: 80%">
        <el-input v-model="hotel_id" placeholder="酒店id" type="text"></el-input>
        xxxxxx
      </el-card>
      <el-upload
          class="avatar-uploader"
          :action="`http://localhost:8000/hotel_image_upload/${this.hotel_id}/`"
          :file-list="url? [url] : []"
          list-type="picture"
          name="url"
          :on-success="handleAvatarSuccess"
      >
        <el-button type="primary">上传图片</el-button>
      </el-upload>
    </el-card>
  </div>
</template>

<script>
export default {
  name: "Home",
  data() {
    return {
      user: JSON.parse(localStorage.getItem('honey-user') || '{}'),
      dataToKeep: '',
      hotel_id: "",
      url:"",
    };
  },
  // created() {
  //   // 页面加载时检查是否存在需要保留的 localStorage 数据
  //   if (localStorage.getItem('dataToKeep')) {
  //     // 将数据从 localStorage 取出，并存储到组件的数据属性中
  //     this.dataToKeep = JSON.parse(localStorage.getItem('dataToKeep'));
  //   }
  // },
  // beforeDestroy() {
  //   // 页面卸载之前将数据重新写入 localStorage
  //   if (this.dataToKeep) {
  //     // 将数据重新写入 localStorage
  //     localStorage.setItem('dataToKeep', JSON.stringify(this.dataToKeep));
  //   }
  // },
  // mounted() {
  //   window.addEventListener('beforeunload', () => {
  //     localStorage.clear();
  //   });
  //   window.addEventListener('unload', () => {
  //     localStorage.clear();
  //   });
  // },
  methods: {
    handleAvatarSuccess(response, file, fileList) {
      // 把shops的图片属性换成上传的图片的链接
      this.url = response.data
      this.dialogPicture = false
    },
  }
}
</script>

<style scoped>

</style>